<template>
    <div class="icon-box">
        <span v-if="type == 'vicon'">
            <n-icon :size="size" :color="color">
                <SmartDisplayOutlined />
            </n-icon>
        </span>
        <span v-else>svg</span>
    </div>
</template>

<script setup>
import { defineProps, defineComponent, computed } from "vue";
import { NIcon } from "naive-ui";
import { SmartDisplayOutlined } from "@vicons/material";

// 接收 props
const props = defineProps({
    icon: {
        type: String,
        required: true,
    },
    size: {
        type: String,
        default: "24",
    },
    color: {
        type: String,
        default: "undefined",
    },
    type: {
        type: String,
        default: "vicon",
    },
});

defineComponent({
    components: { NIcon },
});
</script>

<style scoped lang="less">
.icon-box {
    display: inline-block;
}
</style>
